.navbar-default {

  // want a gradient also in the navbar
  //@include gradient-dkron;
  background-color: $nav-dark;

  margin-bottom:20px;

  .navbar-header {
    .brand {
      margin: 3px;
      line-height: 0;
      margin-left: 5px;
      font-size: 26px;
      a {
        color: #FFF;
        text-decoration: none;
      }

      font-family: 'Lato', sans-serif;
      font-weight: 300;
      img {
        margin-top: 7px;
        margin-bottom: 13px;
        //width: 30px;
        height: 45px;
      }
    }
  }

  .navbar-collapse {
    border:0;
  }

  .navbar-nav > li {

    padding:1em;

    li {
      padding:0;
    }

    &.open {
      .dropdown-menu {

        padding:.5em 0;
        margin:1em 0;
        border-top:1px solid #fff;
        border-bottom:1px solid #fff;

        & > li > a {
          padding:0;
        }
      }
    }

    a {
      color: #FFF;
      padding:0;
      line-height: 1em;
      font-size:.9em!important;
      text-transform:uppercase;
      
      &:hover {
        color: #9d9d9d;
        background:none;
      }
    }
  } 

  .navbar-nav a {
    background:none!important;
  }

  .navbar-nav > .active > a,
  .navbar-nav > .active > a:hover,
  .navbar-nav > .active > a:focus {
    background:none;
    position:relative;
  }
}

@media (min-width:$viewport-medium) {

  .navbar-default {
    .container > .navbar-header {
      margin-right:4em;
    }

    .container > .navbar-collapse {
        margin-top:1.5em;
    }

    .navbar-nav.navbar-right:last-child {
      margin-right:0;
    }

    .navbar-header {
      .navbar-nav > .active > a,
      .navbar-nav > .active > a:hover,
      .navbar-nav > .active > a:focus {
        &:before {
          content:"";
          display:block;
          height:2px;
          background:#fff;
          width:50%;
          position:absolute;
          bottom:-.7em;
        }
      }

    }
  }


  .navbar-nav.main-links > li {

    border-left:1px solid #fff;
    padding:0;
    padding-left:1em;
    margin:.5em;

    &:first-child {
      border:none;
    }

    &.open .dropdown-menu {


      border:none;
      background-color:$nav-dark;

      & > li {

        display:block;

        & > a {
          padding:.5em;
        }
      }
    }

  } 

  .navbar-nav.navbar-right > li {
    padding:.5em;
  }

}

